import React, { Component } from 'react';
import TypeInput from './typeInputer';
import { Button,notification } from 'antd';
import './index.css';
import { connect } from 'dva';
import _ from "lodash"
class PartPropEditor extends Component {
    constructor(props) {
        super(props);
        const { buildingStructure } = props;
        this.state = {
            referCode: null,//下部承台影响code
            spanId: null,
            loading: false,
            buildingStructure,
            componentProps: [],
            referPropiers: [],//扩基或者桩基属性
        }
        this.save = this.save.bind(this)
    }

    save() {
        this.setState({
            loading: true
        })
        let { spans, currentBridgeId } = this.props
        let { componentProps, spanId, referPropiers } = this.state
        if(componentProps&&!componentProps.length){
            notification.warn({message:'没有需要提交的属性!'})
            this.setState({
                loading: false
            })
            return;
        }
        let nspans = _.cloneDeep(spans)
        // let bridgeObj = nspans.find(item => item.bridgeId == currentBridgeId)
        let spanObj = nspans.find(item => item.id == spanId)
        let componentObj = spanObj.componentVos.find(item => item.definitionCode.includes((componentProps.find(item2 => item2.key == 'definitionCode').value)))
        
        let fprops = componentProps.filter(item => item.changed)
        if(fprops&&!fprops.length){
            notification.warn({message:'没有需要提交的属性!'})
            return;
        }
        if (fprops && fprops.length) {
            
            for (let i = 0; i < fprops.length; i++) {
                let item = fprops[i];
                if (componentObj.points[0][item.key]) {
                    componentObj.points[0][item.key] = item.value
                }
                for (let j = 0; j < componentObj.properties.length; j++) {
                    let item2 = componentObj.properties[j];
                    if (item2.key == item.key) {
                        item2.value = item.value
                    }

                }
            }
        }
        if (referPropiers && referPropiers.length) {
            let refComponentObj = spanObj.componentVos.find(item => item.definitionCode.includes((referPropiers.find(item2 => item2.key == 'definitionCode').value)))
            for (let i = 0; i < referPropiers.length; i++) {
                let item = referPropiers[i];
                if (refComponentObj && refComponentObj.points[0][item.key]) {
                    refComponentObj.points[0][item.key] = item.value
                    for (let j = 0; j < refComponentObj.properties.length; j++) {
                        let item2 = refComponentObj.properties[j];
                        if (item2.key == item.key) {
                            item2.value = item.value
                        }

                    }
                }

            }
        }
        this.props.deployComponent([spanObj], currentBridgeId).then(() => {
            this.setState({
                loading: false
            })
            this.props.refresh()
        })
    }
    shouldComponentUpdate(nextProps, nextState) {
        // debugger
        if (!nextProps.mode) {
            return true;
        }
        if (nextProps.mode == 'structure') {
            if (nextProps.buildingStructure) {
                if (nextState.buildingStructure) {
                    if (nextProps.buildingStructure.data('id') != nextState.buildingStructure.data('id')) {
                        this.setState({
                            buildingStructure: nextProps.buildingStructure,
                            spanId: nextProps.buildingStructure.data('spanId'),
                            referPropiers:[]
                        })
                        return true;
                    } else {
                        return true;
                    }
                } else {
                    this.setState({
                        buildingStructure: nextProps.buildingStructure,
                        spanId: nextProps.buildingStructure.data('spanId')
                    })
                    return true;
                }
            }
            return false
        }
        return true

        // nextState.someData !== this.state.someData
    }
    render() {
        const { style = {}, buildingStructure, properties, mode } = this.props;
        let componentProps = properties
        let originalYObj, originalY, originalOffsetY, code, spanId, originalHeight
        if (buildingStructure && mode == 'structure') {
            spanId = buildingStructure.data('spanId')
            code = buildingStructure.data('definitionCode').split('-')[0]
            if (componentProps && componentProps.length) {

                originalYObj = componentProps.find(item => item.key == 'z')
                originalY = originalYObj ? originalYObj.value : 0
            }

            originalOffsetY = buildingStructure.y()
            originalHeight = buildingStructure.height()
        }

        return (
            <div style={{ ...style }} className='panel'>
                <div className='subHeader'>
                    <span className='subHeaderTitle'>参数设计</span>
                </div>
                {componentProps.map((p, index) => (
                    <div key={index} className={`blockLine ${p.value&&!p.hidden? '' : 'hidden'}`}>
                        <div className='inlineLableWrapper'>
                            <span className='label'>{p.label || p.key}:</span>
                        </div>
                        <div className='inlineValueWrapper'>
                            <TypeInput
                                editable={p.type != 'reference' && !p.disabled}
                                onChange={val => {
                                    // debugger
                                    if(!val){
                                        return;
                                    }
                                    let { referPropiers } = this.state
                                    if (buildingStructure) {
                                        let referProObj;//下部承台影响结构属性
                                        let group = buildingStructure.parent().children()
                                        let cx = buildingStructure.cx()
                                        let x = buildingStructure.x()
                                        if (p.key == 'D' || p.key == 'L' || p.key == 'W') {//宽
                                            buildingStructure.attr({ 'width': val })
                                            if (code && !code.includes('brg.fund.mainBeam')) {
                                                buildingStructure.cx(cx)
                                            } else {
                                                buildingStructure.x(x)

                                            }
                                        }

                                        if (p.key == 'Length' || p.key == 'H') {//高
                                            if (code && code.includes('brg.fund.bearingPlatform')) {//承台
                                                let bot;
                                                for (let i = 0; i < group.length; i++) {//扩基|桩基
                                                    const item2 = group[i];
                                                    if (item2.data('definitionCode') && (item2.data('definitionCode').split('-')[0].includes('brg.fund.baseExtension') || item2.data('definitionCode').split('-')[0].includes('brg.fund.pile'))) {
                                                        bot = item2;
                                                    }
                                                }
                                                let offsetY2 = val - buildingStructure.height()
                                                console.log(bot,offsetY2)
                                                buildingStructure.attr({ 'height': val })
                                                bot.translate(0, offsetY2)
                                                let y = originalY + (val - originalHeight) + buildingStructure.height()
                                                if (referPropiers && referPropiers.length) {
                                                    referProObj = referPropiers.find(item => item.key == 'z')

                                                    if (referProObj) {
                                                        referProObj.value = y - 0
                                                    } else {
                                                        referPropiers.push(...[{
                                                            key: 'z',
                                                            enName: 'z',

                                                            value: y - 0
                                                        }, {
                                                            key: 'id',
                                                            enName: "id",
                                                            value: bot.data('id'),
                                                        }, {
                                                            key: 'code',
                                                            enName: "code",
                                                            value: bot.data('definitionCode').split('-')[0],
                                                        }])
                                                    }

                                                } else {
                                                    referPropiers.push(...[{
                                                        key: 'z',
                                                        enName: 'z',

                                                        value: y - 0
                                                    }, {
                                                        key: 'id',
                                                        enName: "id",
                                                        value: bot.data('id'),
                                                    }, {
                                                        key: 'code',
                                                        enName: "code",
                                                        value: bot.data('definitionCode').split('-')[0],
                                                    }])
                                                }
                                                this.setState({
                                                    referCode: bot ? bot.data('definitionCode').split('-')[0] : null
                                                })

                                            } else {
                                                if (code.includes('brg.fund.cappingBeam')) {
                                                    let hOffset2 = val - buildingStructure.height()
                                                    buildingStructure.translate(0, -hOffset2)
                                                } else if (code.includes('brg.fund.mainBeam')) {
                                                    let hOffset2 = val - buildingStructure.height()
                                                    buildingStructure.translate(0, -hOffset2)
                                                }
                                                buildingStructure.attr({ 'height': val })
                                            }

                                        }
                                        if (p.key == 'z') {//纵轴
                                            let bot;
                                            let offsetY = val - originalY;
                                            console.log(code)
                                            if (code && code.includes('brg.fund.bearingPlatform')) {//承台
                                                for (let i = 0; i < group.length; i++) {//扩基|桩基
                                                    const item2 = group[i];
                                                    if (item2.data('definitionCode').split('-')[0] && (item2.data('definitionCode').split('-')[0].includes('brg.fund.baseExtension') || item2.data('definitionCode').split('-')[0].includes('brg.fund.pile'))) {
                                                        bot = item2;
                                                    }
                                                }

                                                buildingStructure.y(originalOffsetY - offsetY)
                                                bot.y(originalOffsetY - offsetY + buildingStructure.height())

                                            } else {
                                                offsetY = val - originalY;
                                                buildingStructure.y(originalOffsetY - offsetY)

                                            }
                                            if (referPropiers && referPropiers.length) {
                                                referProObj = referPropiers.find(item => item.key == 'z')
                                                let y = originalY-offsetY
                                                if (referProObj) {
                                                    referProObj.value = y
                                                } else {
                                                    referPropiers.push({
                                                        key: 'z',
                                                        value: y
                                                    })
                                                }
                                            }
                                            this.setState({
                                                referCode: bot ? bot.data('definitionCode').split('-')[0] : null
                                            })

                                        }
                                        p.value = val
                                        p.changed = true
                                    }

                                    // debugger
                                    this.setState({
                                        spanId,
                                        referPropiers,
                                        componentProps
                                    })
                                    // debugger
                                }}
                                type={p.type == 'text' || p.type == 'reference' ? 'text' : 'number'}
                                value={p.value}
                            />
                        </div>
                    </div>
                ))}
                <div className="propOperate">
                    {/* <Button onClick={this.save}>保存本地</Button><Button type="primary">上传服务器</Button> */}
                    <Button loading={this.state.loading} style={{ marginLeft: '20%' }} onClick={this.save} type="primary">提交</Button>
                </div>

            </div>
        );
    }
}
export default connect(
    ({

    }) => {

    },
    dispatch => ({
        deployComponent: (spans, bridgeId) => dispatch({
            type: 'refSpans/deployComponent',
            payload: { spans, bridgeId }
        }),
    })

)(PartPropEditor);